 <html lang="en">
<head>
	<meta charset="UTF-8">
	<title>聊天室</title>
	<style>
		.operate {
			position: fixed;
			bottom: 0;
			left: 0;
			height: 80px;
			background: white;
			width: 100%;
		}
		.operate input[type=text] {
			width: 100%;
			font-size: 30px;
		}
	</style>
</head>
<body style="background: lightblue;">
	<h1>小小聊天室&emsp;欢迎：<span id="user"><%=username%></span></h1>
	<div>
		<ul class="list">
			
		</ul>
	</div>
	<div class="operate">
		<input type="text" id="content">
	</div>
	<!-- 必须引用秘密js文件。调用io函数，取得socket对象 -->
	<script type="text/javascript" src="/socket.io/socket.io.js"></script>
	<script src="/jquery-1.11.3.min.js"></script>
	<script>
		var socket = io();
//		var socket = io.connect('http://localhost');
		$('#content').keydown(function(e){
			console.log(1)
			if(e.keyCode == 13){
				//把文本内容上传
				console.log(2)
				socket.emit('liaotian',{
					'content' : $('#content').val(),
					'people' : $('#user').html()
				});
				$(this).val('');
			}
		});

		//聊天室内容
		socket.on('liaotian',function(msg){
			//渲染页面
			$('.list').prepend('<li><b>' + msg.people +":</b>" + msg.content + "</li>");
		})
	</script>
</body>
</html>